<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-09-06 00:34:26
 * @LastEditTime : 2020-01-13 10:59:18
 * @LastEditors  : Please set LastEditors
 -->
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="../css/vant.css">
    <link rel="stylesheet" type="text/css" href="../css/base.css" />
    <script type="text/javascript" src="../script/jquery.js"></script>
    <script type="text/javascript" src="../script/echarts.js"></script>
    <script type="text/javascript" src="../script/echarts-gl.min.js"></script>
    <script type="text/javascript" src="../script/china.js"></script>
    <script type="text/javascript" src="../script/layer/mobile/layer.js"></script>
    <script type="text/javascript" src="../script/vue.min.js"></script>
    <script type="text/javascript" src="../script/vant.min.js"></script>
    <script type="text/javascript" src="../script/fastclick.js"></script>
    <script type="text/javascript" src="../script/base.js"></script>
    <style type="text/css">
        body {
            background: url(../image/charts-bg.png) no-repeat !important;
            background-size: 100% 100% !important;
        }

        .head {
            background: transparent;
        }

        .content {
            background: transparent !important;
        }

        .f-l {
            float: left;
        }

        .f-r {
            float: right;
        }

        .full {
            width: 100%;
            height: 100%;
            position: relative;
        }

        .row {
            width: 100%;
            height: 240px;
            /* padding-bottom: 10px; */
        }

        .row .row-bg {
            background: rgba(1, 51, 102, .3);
        }

        .row .row-head {
            background: #08304a;
            border: 1px solid #1c487a;
            height: 40px;
            padding: 0 10px;
            line-height: 40px;
            color: #00e5ff;
            font-size: 15px;
            font-weight: 700;
        }

        .row .row-head .sub {
            color: #02aafd;
            font-size: 12px;
            font-weight: 500;
        }

        .row .row-content {
            width: 100%;
            height: calc(100% - 40px);
            padding: 10px;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <div class="init-full">
            <van-nav-bar class="head" title="看板" left-arrow @click-left="onClickLeft">
            </van-nav-bar>
            <div class="body-no-bottom">
                <div class="content">
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>分店销售额对比</span>
                                <span class="sub">Top10</span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart1"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>分店活跃客户数对比</span>
                                <span class="sub">Top10</span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart2"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>平均销售额对比</span>
                                <span class="sub">Top10</span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart3"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row" style="height: 300px;">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>分店分布图</span>
                                <span class="sub">Top10</span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart_map"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>单次平均使用时长</span>
                                <span class="sub"></span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart4"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>支付方式统计</span>
                                <span class="sub">Top10</span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart5"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>分店新增客户数</span>
                                <span class="sub">Top10</span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart6"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>单品销售额占比</span>
                                <span class="sub">Top10</span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart7"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>补货/送货数占比</span>
                                <span class="sub"></span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart8"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="full row-bg">
                            <div class="row-head">
                                <span>补货/送货金额占比</span>
                                <span class="sub"></span>
                            </div>
                            <div class="row-content">
                                <div class="full" id="chart9"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <van-loading v-if="showLoading" />
            </div>
        </div>
    </div>
</body>

<script type="text/javascript">
    var vm;
    apiready = function () {
        // $('.init-full').show();
        var userInfo = FLD.getUserInfo();
        vm = new Vue({
            el: '#app',
            data: {
                showLoading: false,
                userInfo: userInfo
            },
            created: function () {
                var that = this;
                setTimeout(function () {
                    that.getChartsData()
                }, 200)

            },
            methods: {
                getChartsData() {
                    var that = this;
                    var cmd = '';
                    if (userInfo.S_BranchID == 1) {
                        cmd = 'AP_PCFXKB_N';
                    } else {
                        cmd = 'AP_PCFXKB_FD';
                    }
                    FLD.ajax(cmd, { S_BranchID: userInfo.S_BranchID }, function (res) {
                        //分店销售额对比
                        that.setCharts('chart1', res.ds);
                        that.setCharts('chart2', res.ds1);
                        that.setCharts('chart3', res.ds2);
                        that.setCharts('chart6', res.ds3);
                        that.setCharts('chart5', res.ds4);
                        that.setCharts('chart7', res.ds7);
                        that.setCharts('chart8', res.ds5);
                        that.setCharts('chart9', res.ds8);
                        that.setCharts('chart_map', res.ds6);
                    })
                },
                setCharts(id, array) {
                    var that = this;
                    var x = [];
                    var y = [];
                    for (var i in array) {
                        x.push(array[i].X_Val);
                        y.push(array[i].Y_Val);
                    }
                    if (id == 'chart1') {
                        option1.xAxis.data = x;
                        option1.series[0].data = y;
                        chart1.setOption(option1);
                    }
                    if (id == 'chart2') {
                        option2.xAxis.data = x;
                        option2.series[0].data = y;
                        chart2.setOption(option2);
                    }
                    if (id == 'chart3') {
                        option3.xAxis.data = x;
                        option3.series[0].data = y;
                        chart3.setOption(option3);
                    }
                    if (id == 'chart6') {
                        option6.yAxis.data = x.reverse();
                        option6.series[0].data = y.reverse();
                        chart6.setOption(option6);
                    }
                    if (id == 'chart5') {
                        option5.legend.data = x;
                        option5.series[0].data = [{
                            name: x[0],
                            value: y[0],
                            itemStyle: {
                                color: '#4bec58'
                            }
                        }, {
                            name: x[1],
                            value: y[1],
                            itemStyle: {
                                color: '#19aef1'
                            }
                        }, {
                            name: x[2],
                            value: y[2],
                            itemStyle: {
                                color: '#ffc600'
                            }
                        }];
                        chart5.setOption(option5);
                    }
                    if (id == 'chart7') {
                        var colorArray = ['#ffc600', '#19aef1', '#4bec58', '#4bdbc6', '#19aef1', '#eac736']
                        option7.legend.data = x;
                        var data = [];
                        for (var i in y) {
                            data.push({
                                name: x[i],
                                value: y[i],
                                itemStyle: {
                                    color: colorArray[i]
                                }
                            })
                        }
                        option7.series[0].data = data;
                        chart7.setOption(option7);
                    }
                    if (id == 'chart8') {
                        option8.legend.data = x;
                        option8.series[0].data = [{
                            name: x[0],
                            value: y[0],
                            itemStyle: {
                                color: '#4bdbc6'
                            }
                        }, {
                            name: x[1],
                            value: y[1],
                            itemStyle: {
                                color: '#19aef1'
                            }
                        }];
                        chart8.setOption(option8);
                    }
                    if (id == 'chart9') {
                        option9.legend.data = x;
                        option9.series[0].data = [{
                            name: x[0],
                            value: y[0],
                            itemStyle: {
                                color: '#4bdbc6'
                            }
                        }, {
                            name: x[1],
                            value: y[1],
                            itemStyle: {
                                color: '#19aef1'
                            }
                        }];
                        chart9.setOption(option9);
                    }
                    if (id == 'chart_map') {
                        if (userInfo.S_BranchID == 1) {
                            var map_data = [];
                            for (var i in array) {
                                map_data.push({
                                    name: array[i].X_Val.replace(/省/g, '').replace(/市/g, '').replace(/自治区/g, ''),
                                    value: array[i].Y_Val
                                })
                            }
                            map_option1.series[0].data = map_data;
                            chart_map.setOption(map_option1);
                        } else {
                            var name = userInfo.S_SFNM;
                            $.get('http://' + FLD.serverIP + '/upload/mapJSON/' + name + '.json', function (geoJson) {
                                echarts.registerMap(name, geoJson);//注册 地图
                                var yData = [];
                                for (var i in array) {
                                    yData.push({
                                        name: array[i].X_Val,
                                        value: [array[i].Longitude, array[i].Latitude, array[i].Y_Val]
                                    })
                                }
                                map_option2.geo.map = name;
                                map_option2.series[0].map = name;
                                map_option2.series[0].data = yData;
                                chart_map.setOption(map_option2);
                            }, 'json');
                        }

                    }
                },
                onClickLeft() {
                    api.closeWin();
                }
            }
        })

        var chart1 = echarts.init(document.getElementById('chart1'));
        var option1 = {
            tooltip: {
                trigger: 'axis'
            },
            grid: {
                left: 0,
                right: 5,
                bottom: 0,
                top: 10,
                containLabel: true
            },
            xAxis: {
                type: 'category',
                axisLine: {
                    lineStyle: {
                        color: '#60727f',
                        width: 1
                    }
                },
                axisTick: { show: false },
                axisLabel: {
                    textStyle: {
                        fontSize: 12,
                        color: '#ffffff'
                    },
                    interval: 0,
                    // rotate: 90

                },
                splitLine: {
                    show: false
                },
                data: []
            },
            yAxis: [
                {
                    type: 'value',
                    axisLine: {
                        show: false,
                        lineStyle: {
                            color: '#60727f',
                            width: 1
                        }
                    },
                    axisTick: { show: false },
                    axisLabel: {
                        formatter: '{value}',
                        textStyle: {
                            fontSize: 12,
                            color: '#ffffff'
                        }
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: '#60727f',
                            width: 1
                        }
                    }
                }
            ],

            series: [
                {
                    name: '订单金额',
                    type: 'bar',
                    itemStyle: {
                        color: '#e3ba21'
                    },
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(
                                0, 0, 0, 1,
                                [
                                    { offset: 0, color: '#039ee6' },
                                    { offset: 0.5, color: '#3854e0' },
                                    { offset: 1, color: '#6e08d9' }
                                ]
                            )
                        }
                    },
                    barWidth: 20,
                    data: []
                }
            ]
        };
        // chart1.setOption(option1)

        var chart2 = echarts.init(document.getElementById('chart2'));
        var option2 = {
            tooltip: {
                trigger: 'axis'
            },
            grid: {
                left: 0,
                right: 5,
                bottom: 0,
                top: 10,
                containLabel: true
            },
            xAxis: {
                type: 'category',
                axisLine: {
                    lineStyle: {
                        color: '#60727f',
                        width: 1
                    }
                },
                axisTick: { show: false },
                axisLabel: {
                    textStyle: {
                        fontSize: 12,
                        color: '#ffffff'
                    },
                    interval: 0,
                    // rotate: 20

                },
                splitLine: {
                    show: false
                },
                data: []
            },
            yAxis: [
                {
                    type: 'value',
                    axisLine: {
                        show: false,
                        lineStyle: {
                            color: '#60727f',
                            width: 1
                        }
                    },
                    axisTick: { show: false },
                    axisLabel: {
                        formatter: '{value}',
                        textStyle: {
                            fontSize: 12,
                            color: '#ffffff'
                        }
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: '#60727f',
                            width: 1
                        }
                    }
                }
            ],

            series: [
                {
                    name: '订单金额',
                    type: 'line',
                    itemStyle: {
                        color: '#e3ba21'
                    },
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(
                                0, 0, 0, 1,
                                [
                                    { offset: 0, color: '#02ff67' },
                                    { offset: 1, color: '#00ffff' }
                                ]
                            )
                        }
                    },
                    barWidth: 20,
                    data: []
                }
            ]
        };
        // chart2.setOption(option2)

        var chart3 = echarts.init(document.getElementById('chart3'));
        var option3 = {
            tooltip: {
                trigger: 'axis'
            },
            grid: {
                left: 0,
                right: 0,
                bottom: 0,
                top: 10,
                containLabel: true
            },
            xAxis: {
                type: 'category',
                axisLine: {
                    lineStyle: {
                        color: '#575558',
                        width: 1
                    }
                },
                axisTick: { show: false },
                axisLabel: {
                    textStyle: {
                        fontSize: 12,
                        color: '#ffffff',
                    },
                    interval: 0,
                    // rotate: 20

                },
                splitLine: {
                    show: false
                },
                data: []
            },
            yAxis: {
                type: 'value',
                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                axisLabel: {
                    formatter: '{value}',
                    textStyle: {
                        fontSize: 12,
                        color: '#ffffff'
                    }
                },
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: '#575558',
                        width: 1
                    }
                }
            },

            series: [
                {
                    data: [],
                    type: 'line',
                    symbolSize: 0,
                    smooth: true,
                    lineStyle: {
                        color: 'rgba(38,255,76,.7)',
                        type: 'solid'
                    },
                    areaStyle: {
                        color: {
                            type: 'linear',
                            x: 0,
                            y: 0,
                            x2: 0,
                            y2: 1,
                            colorStops: [{
                                offset: 0, color: 'rgba(38,255,76,1)'
                            }, {
                                offset: 0.7, color: 'rgba(38,255,76,0.3)'
                            }, {
                                offset: 1, color: 'rgba(38,255,76,0)'
                            }],
                            globalCoord: false // 缺省为 false
                        }
                    }
                }
            ]
        };
        // chart3.setOption(option3);

        var chart4 = echarts.init(document.getElementById('chart4'));
        var option4 = {
            tooltip: {
                formatter: "{a} <br/>{b} : {c}%"
            },

            series: [
                {
                    type: 'gauge',
                    detail: {
                        show: false
                    },
                    radius: '140%',
                    startAngle: 180,
                    center: ['50%', '90%'],
                    splitNumber: 5,
                    max: 10,
                    endAngle: 0,
                    pointer: {
                        width: 4,
                        length: '50%'
                    },
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        textStyle: {
                            fontSize: 12,
                            color: '#ffffff'
                        }

                    },
                    axisLine: {
                        show: true,
                        lineStyle: {
                            width: 10,
                            color: [
                                [1, new echarts.graphic.LinearGradient(0, 0, 1, 0, [
                                    {
                                        offset: 0.1,
                                        color: "#FFC600"
                                    },
                                    {
                                        offset: 0.6,
                                        color: "#30D27C"
                                    },
                                    {
                                        offset: 1,
                                        color: "#0B95FF"
                                    }
                                ])
                                ]
                            ]

                        }
                    },
                    data: [{ value: 3 }]
                }
            ]
        };
        chart4.setOption(option4);

        var chart5 = echarts.init(document.getElementById('chart5'));
        var option5 = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                left: 'left',
                data: [],
                textStyle: {
                    color: '#ffffff',
                    fontSize: 12
                }
            },
            series: [
                {
                    type: 'pie',
                    radius: '55%',
                    name: '支付方式',
                    center: ['50%', '60%'],
                    label: {
                        normal: {
                            formatter: function (obj) {
                                return '{b|' + obj.value + '}';
                            },
                            rich: {
                                abg: {
                                    backgroundColor: '#03A9F4',
                                    align: 'center',
                                    width: 60,
                                    height: 20,
                                    lineHeight: 22,
                                    borderRadius: 4,
                                    color: '#fff',
                                    fontSize: 12,
                                    marginRight: 5
                                },
                                b: {
                                    fontSize: 12,
                                    color: '#fff',
                                    lineHeight: 20,
                                    align: 'right'
                                },
                                c: {
                                    color: '#fff',
                                    lineHeight: 20,
                                    fontSize: 12
                                }
                            }
                        }
                    },
                    data: [],
                    // label: {
                    //     normal: {
                    //         show: true,
                    //         position: 'center'
                    //     }
                    // },
                    // labelLine: {
                    //     normal: {
                    //         show: true
                    //     }
                    // },
                    // itemStyle: {
                    //     emphasis: {
                    //         shadowBlur: 10,
                    //         shadowOffsetX: 0,
                    //         shadowColor: 'rgba(0, 0, 0, 0.5)'
                    //     }
                    // }

                }
            ]
        };
        // chart5.setOption(option5)

        var chart6 = echarts.init(document.getElementById('chart6'));
        var option6 = {
            tooltip: {
                trigger: 'axis'
            },
            grid: {
                left: 0,
                right: 5,
                bottom: 0,
                top: 10,
                containLabel: true
            },
            yAxis: {
                type: 'category',
                axisLine: {
                    lineStyle: {
                        color: '#60727f',
                        width: 1
                    }
                },
                axisTick: { show: false },
                axisLabel: {
                    textStyle: {
                        fontSize: 12,
                        color: '#ffffff'
                    },
                    interval: 0,
                    // rotate: 20

                },
                splitLine: {
                    show: false
                },
                data: []
            },
            xAxis: [
                {
                    type: 'value',
                    axisLine: {
                        show: false,
                        lineStyle: {
                            color: '#60727f',
                            width: 1
                        }
                    },
                    axisTick: { show: false },
                    axisLabel: {
                        formatter: '{value}',
                        textStyle: {
                            fontSize: 12,
                            color: '#ffffff'
                        }
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: '#60727f',
                            width: 1
                        }
                    }
                }
            ],

            series: [
                {
                    type: 'bar',
                    itemStyle: {
                        color: '#e3ba21'
                    },
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(
                                1, 0, 0, 0,
                                [
                                    { offset: 0, color: '#8dffd1' },
                                    { offset: 0.5, color: '#64cfee' },
                                    { offset: 1, color: '#2f68de' }
                                ]
                            )
                        }
                    },
                    barWidth: 8,
                    data: []
                }
            ]
        };
        // chart6.setOption(option6)

        var chart7 = echarts.init(document.getElementById('chart7'));
        var option7 = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                left: 'left',
                textStyle: {
                    color: '#ccc'
                },
                data: []
            },
            calculable: true,
            series: [
                {
                    name: '面积模式',
                    type: 'pie',
                    radius: [20, 50],
                    center: ['55%', '50%'],
                    roseType: 'area',
                    data: []
                }
            ]
        };
        // chart7.setOption(option7);


        var chart8 = echarts.init(document.getElementById('chart8'));
        var option8 = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                textStyle: {
                    color: '#ffffff',
                    fontSize: 12
                },
                data: [],

            },
            series: [
                {
                    type: 'pie',
                    name: '送货/补货方式',
                    radius: ['50%', '70%'],
                    avoidLabelOverlap: false,
                    label: {
                        normal: {
                            formatter: function (obj) {
                                return '{b|' + obj.name + ':}{b|' + obj.value + '次}';
                            },
                            rich: {
                                abg: {
                                    backgroundColor: '#03A9F4',
                                    align: 'center',
                                    width: 60,
                                    height: 20,
                                    lineHeight: 22,
                                    borderRadius: 4,
                                    color: '#fff',
                                    fontSize: 12,
                                    marginRight: 5
                                },
                                b: {
                                    fontSize: 12,
                                    color: '#fff',
                                    lineHeight: 20,
                                    align: 'right'
                                },
                                c: {
                                    color: '#fff',
                                    lineHeight: 20,
                                    fontSize: 12
                                }
                            }
                        }
                    },
                    data: []
                }
            ]
        };
        // chart8.setOption(option8);


        var chart9 = echarts.init(document.getElementById('chart9'));
        var option9 = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                textStyle: {
                    color: '#ffffff',
                    fontSize: 12
                },
                data: [],

            },
            series: [
                {
                    type: 'pie',
                    name: '送货/补货方式',
                    radius: ['40%', '60%'],
                    avoidLabelOverlap: false,
                    label: {
                        normal: {
                            formatter: function (obj) {
                                return '{b|' + obj.name.replace(/金额/g,'') + ':}{b|' + obj.value + '元}';
                            },
                            rich: {
                                abg: {
                                    backgroundColor: '#03A9F4',
                                    align: 'center',
                                    width: 60,
                                    height: 20,
                                    lineHeight: 22,
                                    borderRadius: 4,
                                    color: '#fff',
                                    fontSize: 12,
                                    marginRight: 5
                                },
                                b: {
                                    fontSize: 12,
                                    color: '#fff',
                                    lineHeight: 20,
                                    align: 'right'
                                },
                                c: {
                                    color: '#fff',
                                    lineHeight: 20,
                                    fontSize: 12
                                }
                            }
                        }
                    },
                    data: []
                }
            ]
        };
        // chart9.setOption(option9);

        var chart_map = echarts.init(document.getElementById('chart_map'));
        var map_option1 = {
            tooltip: {},
            legend: {
                left: 'left',
                data: ['强', '中', '弱'],
                textStyle: {
                    color: '#ccc'
                }
            },
            backgroundColor: 'transparent',
            visualMap: {
                type: 'continuous',
                text: ['', ''],
                showLabel: true,
                seriesIndex: [0],
                min: 0,
                max: 200000,
                inRange: {
                    color: ['#fdffe5', '#f7ff83', '#ffdf83', '#ffc283', '#ff9483', '#ff0000',]
                },
                textStyle: {
                    color: '#fff'
                },
                bottom: 30,
                left: 'left',
            },

            geo: {
                map: 'china',
                show: true,
                top: 20,
                left: '15%',
                right: '15%',
                aspectScale: 0.75, //长宽比
                roam: false,
                label: {
                    emphasis: {
                        show: false
                    }
                },
                itemStyle: {
                    normal: {
                        areaColor: '#091632',
                        borderColor: '#1773c3',
                        shadowColor: '#1773c3',
                        shadowBlur: 20
                    }
                },
                regions: [{
                    name: '南海诸岛',
                    value: 0,
                    itemStyle: {
                        normal: {
                            opacity: 0,
                            label: {
                                show: false
                            }
                        }
                    }
                }],
            },
            series: [
                {
                    name: '省份',
                    type: 'map',
                    roam: false,
                    geoIndex: 0,
                    label: {
                        show: false,
                    },
                    data: []
                },

            ]
        }
        // chart_map.setOption(map_option);

        var map_option2 = {
            tooltip: {},
            backgroundColor: 'transparent',
            geo: {
                map: '',
                show: true,
                top: 10,
                aspectScale: 0.75, //长宽比
                roam: true,
                label: {
                    emphasis: {
                        show: false
                    }
                },
                itemStyle: {
                    normal: {
                        areaColor: '#091632',
                        borderColor: '#1773c3',
                        shadowColor: '#1773c3',
                        shadowBlur: 20
                    }
                }
            },
            series: [{
                type: 'effectScatter',
                coordinateSystem: 'geo',
                data: [],
                symbolSize: 10,
                showEffectOn: 'render',
                rippleEffect: {
                    brushType: 'stroke'
                },
                hoverAnimation: true,
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: false
                    }
                },
                itemStyle: {
                    normal: {
                        color: '#eac736',
                        shadowBlur: 10,
                        shadowColor: '#05C3F9'
                    }
                },
                zlevel: 1
            }]
        }
    };
</script>

</html>